<!DOCTYPE html>
<!-- 
Template Name: Metronic - Responsive Admin Dashboard Template build with Twitter Bootstrap 3.1.1
Version: 2.0.2
Author: KeenThemes
Website: http://www.keenthemes.com/
Contact: support@keenthemes.com
Purchase: http://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469?ref=keenthemes
License: You must have a valid license purchased only from themeforest(the above link) in order to legally use the theme for your project.
-->
<!--[if IE 8]>
<html lang="en" class="ie8 no-js">
	<![endif]-->
	<!--[if IE 9]>
	<html lang="en" class="ie9 no-js">
		<![endif]-->
		<!--[if !IE]>
		<!-->
		<!--<![endif]-->
		<!-- BEGIN HEAD ->
		<!-- BEGIN BODY -->
		<style>
/**{
text-align: center;
}*/
.trimming{
width: 110px;
}

.wraping{
background: #fff;
}
.table_btn_box{
		margin-bottom: 5px;
		float: left;
	}
	.modal-content .modal-footer button.btn-primary {
		margin-top:0; 
		margin-bottom: 0;
	}
		.btn-div{
		float: left;top: 10px;margin-bottom: 5px;padding-left: 10px;
	}
			.row{
			margin: 0;
		}
		.paddingLeft{
			padding-left: 0;
		}
		.paddingRight{
			padding-right: 0;
		}
		.text-right{
			text-align: right;
			padding-right: 15px;
		}
		.paddingTop .marginLeft{
			margin-left:0; 
		}
</style>
<body class="page-header-fixed">

		<div class="btn-div">

			<a class="btn blue" href="javascript:;"  data-target="#chargerRateModel" 
data-toggle="modal" ng-click="addChargerRate();"> <i class="fa fa-plus"></i>
				新增
			</a>
		</div>
		<table class="table table-striped table-bordered table-hover" id="table_1">
			<thead>
				<tr>
					<th>方案号</th>
					<th>方案名称</th>
					<th>收费类型</th>
					<th>费用类型</th>
					<th>是否默认费率</th>
					<th>是否有效</th>
					<th>对应桩版本</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody>
				<tr class="odd gradeX" ng-repeat="chargerRate in chargerRateList  track by $index" pg-loaded="{{$last}}" target-table="table_1">
					<td>
						<span ng-bind="chargerRate.rate_schema"></span>
					</td>
					<td>
						<span ng-bind="chargerRate.rate_name | commonSubString"></span>
					</td>
					<td>
						<span ng-bind="chargerRate.charge_mode | getValueInStaticFilter : 'chargeModeArray'"></span>
					</td>
					<td>
						<span ng-bind="chargerRate.fee_type | getValueInStaticFilter : 'feeTypeArray'"></span>
					</td>
					<td>
						<span ng-bind="chargerRate.default_ind  | getValueInStaticFilter : 'whetherArray'"></span>
					</td>
					<td>
						<span ng-bind="chargerRate.valid_flag  | getValueInStaticFilter : 'validArray'"></span>
					</td>
					<td>
						<span ng-bind="chargerRate.default_for | getValueInStaticFilter : 'pileVersions'"></span>
					</td>
					<td>
						<a class="btn" href="javascript:;"  data-target="#chargerRateModel" 
data-toggle="modal" ng-click="updateChargerRate(chargerRate);">修改</a>
						<a class="btn" href="javascript:;"  data-target="#allotChargerManage" 
data-toggle="modal" ng-click="allotChargerManage(chargerRate);" 
ng-if="'1'==chargerRate.valid_flag">绑定电桩管理</a>
					</td>
				</tr>
			</tbody>
		</table>
<tm-pagination conf="paginationConf"></tm-pagination>
		<div id="chargerRateModel" class="modal fade" role="dialog" aria-hidden="true" data-backdrop="false">
			<div class="modal-dialog" >
				<div class="modal-content" >
				<form class="w5c-form demo-form" role="form"
                        w5c-form-validate="vm.validateOptions" novalidate name="validateForm">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="validateForm.reset()">×</button>
						<h4 class="modal-title">费率新增/修改</h4>
					</div>
					<div class="modal-body form">
						<div class="form-group">
							<div class="row">
								<label class="col-sm-3 control-label text-right"><span class="star-color">* </span>方案名称</label>
								<div class="col-sm-8">
									<div class="input-group">
										<input type="text" class="form-control" ng-model="selectChargerRate.rate_name" name="rate_name" required="" ng-maxlength="32" onkeyup="value=value.replace(/[^\a-\z\A-\Z0-9\u4E00-\u9FA5]/g,'')" placeholder="请输入字母、数字、中文组合"/>
									</div>
								</div>
							</div>
							<div class="row">
								<label class="col-sm-3 control-label text-right"><span class="star-color">* </span>费用类型</label>
								<div class="col-sm-8">
									<div class="input-group">
										<select class="form-control" ng-model="selectChargerRate.fee_type" required="" name="fee_type">
											<option value="">请选择费用类型</option>
											<option value="0">尚未分配类型</option>
											<option value="1">预约费用</option>
											<option value="2">充电费用</option>
											<option value="3">充电服务费</option>
										</select>
									</div>
								</div>
							</div>
							<div class="row">
								<label class="col-sm-3 control-label text-right"><span class="star-color">* </span>收费类型</label>
								<div class="col-sm-8 paddingTop">
									<div class="input-group">
										<label  class="paddingLeft col-md-4 radio-inline">
											<input ng-model="selectChargerRate.charge_mode" type="radio"  value="0" 
ng-selected="selectChargerRate.charge_mode==1">按时间收费</label>
										<div ng-if="selectChargerRate.fee_type!='2'">
											<label  class="paddingLeft col-md-4 radio-inline">
												<input ng-model="selectChargerRate.charge_mode" type="radio"  value="1" 
	ng-selected="selectChargerRate.charge_mode==0">按次数收费</label>
										</div>
									</div>
								</div>
							</div>
							<div class="row" ng-if="'insert'!=modifyType">
								<label class="col-sm-3 control-label text-right"><span class="star-color">* </span>是否启用</label>
								<div class="col-md-8 paddingTop">
									<div class="radio-list">
										<label  class="radio-inline col-md-4 trimming">
											<input ng-model="selectChargerRate.valid_flag" type="radio"  value="1"
ng-selected="selectChargerRate.valid_flag==1">启用</label>
										<label  class="radio-inline col-md-4 paddingLeft marginLeft">
											<input ng-model="selectChargerRate.valid_flag" type="radio"  value="0" 
ng-selected="selectChargerRate.valid_flag==0">停用</label>
									</div>
								</div>
							</div>
							<div class="row">
								<label class="col-sm-3 control-label text-right"><span class="star-color">* </span>是否默认费率</label>
								<div class="col-md-8 paddingTop">
									<div class="radio-list">
										<label  class="radio-inline col-md-4 trimming">
											<input ng-model="selectChargerRate.default_ind" type="radio"  value="1"
ng-selected="selectChargerRate.default_ind==1">是</label>
										<label  class="radio-inline col-md-4 paddingLeft marginLeft">
											<input ng-model="selectChargerRate.default_ind" type="radio"  value="0" 
ng-selected="selectChargerRate.default_ind==0">否</label>
									</div>
								</div>
							</div>
							<div class="row" ng-if="selectChargerRate.default_ind=='1'">
								<label class="col-sm-3 control-label text-right"><span class="star-color">* </span>对应桩版本</label>
								<div class="col-sm-8">
									<div class="input-group">
										<select class="form-control" 
                                              ng-options="omsCode.code as omsCode.description for omsCode in omsCodeList "
                                              ng-model="selectChargerRate.default_for">
                                              <option value="">请选择对应桩版本</option>
                                         </select>
									</div>
								</div>
							</div>  
							<div class="row" ng-if="selectChargerRate.fee_type!='2'&&selectChargerRate.charge_mode==1">
								<label class="col-sm-3 control-label text-right"><span class="star-color">* </span>金额(元/次)</label>
								<div class="col-sm-8">
									<div class="input-group">
										<input type="text" class="form-control" ng-model="selectChargerRate.rate" required="" name="rate" w5c-dynamic-element ng-maxlength="4" ng-pattern="/^(-|\+)?\d+(\.\d+)?$/"/>
									</div>
								</div>
							</div>   
							<hr />
							<div ng-repeat="timeInterval in timeIntervalArray track by $index" ng-if="selectChargerRate.charge_mode==0">

								<div class="row">
									<label class="col-sm-2 control-label text-right">开始时间</label>
									<div class="col-sm-2">
										<div class="input-group">
											<input type="text" class="form-control" ng-readonly="true" ng-model="timeInterval.startime" id="time_input" />
										</div>
									</div>
									<label class="col-sm-2 control-label text-right">结束时间</label>
									<div class="col-sm-2">
										<div class="input-group">
											<select class="form-control paddingLeft paddingRight" ng-model="timeInterval.endTime" ng-disabled="!$last"
ng-options="endTimeObj.index as endTimeObj.time for endTimeObj in timeInterval.endTimeArray" ng-change="changeTimeInterval(timeInterval.endTime,$index)"></select>
										</div>
									</div>
									<div class="">
										<label class="col-sm-2 control-label text-right">金额(元)</label>
										<div class="col-sm-2">
											<div class="input-group">
												<input type="text" class="form-control" ng-model="timeInterval.rate"/>
											</div>
										</div>
									</div>
								</div>
								<div class="row text-right" ng-if="$last&&!$first">
									<button type="button" class="btn btn-danger" ng-click="removeTimeInterval($index);"> <i class="fa fa-times" ></i>
										删除
									</button>
								</div>
								<hr />
							</div>

						</div>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-danger" data-dismiss="modal" ng-click="validateForm.reset()">
							<i class="fa fa-times"></i>
							关闭
						</button>
						<button type="button" class="btn btn-primary" w5c-form-submit="modifyChargerRate();">
							<i class="fa fa-check"></i>
							保存
						</button>
					</div>
					</form>
				</div>
			</div>
		</div>

		<div id="allotChargerManage" class="modal fade" role="dialog" aria-hidden="true" data-backdrop="false" >
			<div class="modal-dialog" style="width:1000px">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal"
aria-hidden="true">×</button>
						<h4 class="modal-title">费率【{{selectChargerRate.rate_name}}】分配电桩管理</h4>
					</div>

					<div class="modal-body form">

						<div class="form-group">
							<div class="table_btn_box">
								<a class="btn blue" href="javascript:;" ng-click="changeCharerList('alloted');">显示已分配电桩</a>
								<a class="btn blue" href="javascript:;" ng-click="changeCharerList('unAllot');">显示可分配电桩</a>
								<a class="btn blue abnormal" href="javascript:;" ng-click="relevanceCharger();" ng-if="relevanceFlag=='unAllot'">绑定</a>
								<a class="btn blue u_abnormal" href="javascript:;" ng-click="relevanceCharger();" ng-if="relevanceFlag=='alloted'">解绑</a>
							</div>
							<table class="table table-striped table-bordered table-hover"
id="table_2">
								<thead>
									<tr>
										<th class="table-checkbox">
											<input type="checkbox" class="checkbox_table" />
										</th>
										<th>桩ID</th>
										<th>站点名称</th>
										<th>运营二维码</th>
									</tr>
								</thead>
								<tbody>
									<tr class="odd gradeX"
ng-repeat="charger in chargerList  track by $index"
on-loaded="{{$last}}" target-table="table_2">
										<td>
											<input type="checkbox" class="checkboxes" value="{{charger.charger_id}}" name="chargerRowModel"/>
										</td>
										<td>
											<span ng-bind="charger.charger_id"></span>
										</td>
										<td>
											<span ng-bind="charger.station_name"></span>
										</td>
										<td>
											<span ng-bind="charger.qr_code"></span>
										</td>
									</tr>
								</tbody>
							</table>
						</div>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-danger" data-dismiss="modal">
							<i class="fa fa-times"></i>
							关闭
						</button>
					</div>
				</div>
			</div>
		</div>

</body>
	</html>